<template>
  <div class="page-container fullpage">
    <el-card>
      <h3>查看日程</h3>
      <!-- 顶部提示已隐藏 -->

      <div style="display:flex;gap:8px;align-items:center;margin-top:8px">
        <el-button size="small" @click="sortDesc">按时间降序</el-button>
        <el-button size="small" @click="sortAsc">按时间升序</el-button>
      </div>

  <!-- 不展示后端的 serverMessage（例如 '查询成功。'） -->

      <el-table :data="tasks" style="width:100%; margin-top:12px">
        <el-table-column prop="masname" label="任务名" />
        <el-table-column prop="massion" label="内容" />
        <el-table-column prop="massiontime" label="时间" />
      </el-table>
      <div style="margin-top:12px; text-align:right">
        <el-button @click="goBack">返回主界面</el-button>
      </div>
    </el-card>
  </div>
</template>

<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { useRouter } from 'vue-router'
import api from '../utils/api'

const queryName = ref(localStorage.getItem('username') || '')
const tasks = ref<Array<any>>([])
const serverMessage = ref('')

const load = async () => {
  const username = localStorage.getItem('username') || ''
  if (!username) { console.warn('未检测到登录用户，请先登录'); return }
  try {
    const resp: any = await api.get('/stumsg', { params: { username } })
    console.log('get stumsg resp', resp)
    if (resp && resp.operationResult === 'SUCC') {
      tasks.value = resp.data || []
      serverMessage.value = resp.errorMsg || ''
    } else {
      serverMessage.value = resp?.errorMsg || '未找到任务'
      // keep server message internal; avoid global popup to reduce noise
      console.info('serverMessage:', serverMessage.value)
      tasks.value = []
    }
  } catch (err) {
    console.error(err)
    // avoid popup; log instead
    console.error('请求失败', err)
  }
}

// clear not needed for fixed current-user view; keep function if needed later
onMounted(() => { if (queryName.value) load() })

const router = useRouter()
const goBack = () => { try { router.push('/dashboard') } catch (e) {} }

const parseTime = (s: any) => {
  if (!s) return null
  const str = String(s).trim()
  // expecting YYYY-MM-DD HH:mm:ss
  const t = str.replace(' ', 'T')
  const d = new Date(t)
  if (isNaN(d.getTime())) return null
  return d.getTime()
}

const sortAsc = () => {
  tasks.value = [...tasks.value].sort((a: any, b: any) => {
    const ta = parseTime(a?.massiontime)
    const tb = parseTime(b?.massiontime)
    if (ta === null && tb === null) return 0
    if (ta === null) return 1
    if (tb === null) return -1
    return ta - tb
  })
}

const sortDesc = () => {
  tasks.value = [...tasks.value].sort((a: any, b: any) => {
    const ta = parseTime(a?.massiontime)
    const tb = parseTime(b?.massiontime)
    if (ta === null && tb === null) return 0
    if (ta === null) return 1
    if (tb === null) return -1
    return tb - ta
  })
}
</script>

<style scoped>
.page-container { padding: 16px }
</style>
